/* @group Settings */

/* @group Core */

*,p {
  font-family: ~"[[setting:bodyfont]]"
}

body {
  color: ~"[[setting:themetextcolor]]";
  font-family: ~"[[setting:bodyfont]]";
  background-image: ~"[[setting:pagebackground]]";
  background-attachment: ~"[[setting:backgroundattach]]";
  background-repeat: ~"[[setting:backgroundrepeat]]";
  background-size: ~"[[setting:backgroundsize]]";
  i {
    color: ~"[[setting:themeiconcolor]]";
    &:hover {
      color: ~"[[setting:themehovercolor]]";
    }
  }
}

.container-fluid {
  max-width: ~"[[setting:pagewidth]]";
}

h1, h2, h3, h4, h5, h6, #adminsettings h3 {
  color: ~"[[setting:themetextcolor]]";
}

a, a:visited {
  color: ~"[[setting:themeurlcolor]]";
}

a:hover {
  color: ~"[[setting:themehovercolor]]";
  &:before {
    color: ~"[[setting:themehovercolor]]";
  }
}

a:before {
  color: ~"[[setting:themeiconcolor]]";
  display: inline-block;
  text-decoration: none;
  &:hover {
    color: ~"[[setting:themehovercolor]]";
  }
}

.color {
  color: ~"[[setting:themecolor]]";
}

/* @group Custom */

.bor {
  background: url(~"[[pix:theme|bg/dot]]") repeat-x;
}

img.userpicture,
img.profilepicture {
  box-shadow: 0px 0px 3px ~"[[setting:themecolor]]";
}

/* @end */

/* @end */

/* @group Header */

#page-header {
  background: url(~"'[[setting:headerbackground]]'") repeat;
}

a.logo {
  background-image: ~"[[setting:logo]]";
}

h1#title {
  color: ~"[[setting:themetextcolor]]";
}

#headerlogo {
  border-right: 1px dotted ~"[[setting:themecolor]]";
}

/* @group Social Buttons */

button.website:hover, button.website:focus {
  background-color: ~"[[setting:themecolor]]";
}

/* @end */

/* @end */

/* @group Theme Colours Menu */
a {
  .colours-default {
    color: ~"[[setting:themecolor]]" !important;
  }
  .colours-alternative1 {
    color: ~"[[setting:alternativethemecolor1]]" !important;
  }
  .colours-alternative2 {
    color: ~"[[setting:alternativethemecolor2]]" !important;
  }
  .colours-alternative3 {
    color: ~"[[setting:alternativethemecolor3]]" !important;
  }
  .colours-alternative4 {
    color: ~"[[setting:alternativethemecolor4]]" !important;
  }
}
/* @end */

/* @group Navbar
 */

.navbar, .navbar-inner {
  background-color: ~"[[setting:themecolor]]";
}

/* @end */

/* @group Course
 */

.course-content ul li.section.main {
  background: url(~"[[pix:theme|bg/dot]]") bottom repeat-x;
  &.clearfix.current {
    box-shadow: 4px 4px 8px 2px ~"[[setting:themecolor]]";
    border-style: solid;
    border-width: 1px;
  }
}

h2.pagetitle {
  background: url(~"[[pix:theme|bg/dot]]") left center repeat-x;
}

.firstword {
  color: ~"[[setting:themetextcolor]]" !important;
}

/* @end */

/* @group Forums */

.forumpost {
  .subject {
    color: ~"[[setting:themetextcolor]]";
  }
}

/* @end */

/* @group Buttons */

.button {
  a, a:visited {
    background-color: ~"[[setting:themecolor]]";
  }
}

a.marketing-button,
a.marketing-button:visited, {
  background-color: ~"[[setting:themecolor]]";
}

a.marketing-button:hover {
  background-color: ~"[[setting:themehovercolor]]";
}

/* @end */

/* @group Blocks */

.block {
  a {
    color: ~"[[setting:themeurlcolor]]";
  }
  a:hover {
    color: ~"[[setting:themehovercolor]]";
  }
  .header .title h2:before, &.block_iconic_html .header .title h2 span.fa:before {
    color: ~"[[setting:themeiconcolor]]";
  }
}

.block_rss_client .footer a {
  background-color: ~"[[setting:themecolor]]";
  &:hover {
    background-color: ~"[[setting:themehovercolor]]";
  }
}

.block_login {
  .content {
    .footer a {
      background-color: ~"[[setting:themecolor]]";
      font-family: ~"[[setting:bodyfont]]";
      &:hover {
        backgroundcolor: ~"[[setting:themehovercolor]]";
      }
    }
    form input[type="submit"] {
      background-color: ~"[[setting:themecolor]]";
      font-family: ~"[[setting:bodyfont]]";
    }
  }
}

/* @end */

/* @group Frontpage */
#site-news-forum,
#frontpage-course-list,
#frontpage-category-combo,
#frontpage-category-names {
  background: url(~"[[pix:theme|bg/dot]]") left top repeat-x;
}

#page-site-index h2.headingblock:before {
  color: ~"[[setting:themetextcolor]]";
}

/* @end */

/* @group Home News Boxes */

.service i {
  color: ~"[[setting:themecolor]]";
}

/* @end */

/* @group Footer */

#page-footer {
  background-color: ~"[[setting:footercolor]]";
  color: ~"[[setting:footertextcolor]]";
  border-top: 2px solid ~"[[setting:themecolor]]";
  border-bottom: 3px solid ~"[[setting:themecolor]]";
  a, a > i {
    color: ~"[[setting:footerurlcolor]]";
  }
  a:hover, a:hover > i {
    color: ~"[[setting:footerhovercolor]]";
  }
  .footnote {
    color: ~"[[setting:footertextcolor]]";
    a, a:visited {
      color: ~"[[setting:footerurlcolor]]" !important;
    }
    a:hover {
      color: ~"[[setting:footerhovercolor]]" !important;
    }
  }
  hr {
    border-top: 1px solid ~"[[setting:footersepcolor]]";
  }
  h4 {
    border-bottom: 1px solid ~"[[setting:footersepcolor]]";
    color: ~"[[setting:footerheadingcolor]]";
  }
  .tree_item.branch:before {
    color: ~"[[setting:themeiconcolor]]";
  }
}

#page-footer .block_html ul li:before,
#greyboxright ul li:before {
  background-color: ~"[[setting:themecolor]]";
}

/* @group Footer Block Formatting */

#page-footer {
  .block .header {
    border-bottom: 1px solid ~"[[setting:footersepcolor]]";
    .title {
      h2 {
        color: ~"[[setting:footerheadingcolor]]";
        &:before {
          color: ~"[[setting:themecolor]]";
        }
      }
    }
  }
  .block_login input[type="submit"] {
    background-color: ~"[[setting:themecolor]]";
    &:hover {
      background-color: ~"[[setting:themehovercolor]]";
    }
  }
  .block_rss_client .content a {
    color: ~"[[setting:themeurlcolor]]";
  }
}

/* @end */

/* @end */

/* @group Marketing Spots */

#marketing-image1 {
  background-image: ~"[[setting:marketing1image]]";
  background-repeat: no-repeat;
}

#marketing-image2 {
  background-image: ~"[[setting:marketing2image]]";
  background-repeat: no-repeat;
}

#marketing-image3 {
  background-image: ~"[[setting:marketing3image]]";
  background-repeat: no-repeat;
}

.marketing-image {
  height: ~"[[setting:marketingheight]]";
}

/* @end */

/* @group Profile Image */

.socials img:hover {
  box-shadow: 0px 0px 10px 0px ~"[[setting:themecolor]]";
}

/* @end */

/* @group Tabs */

.nav-tabs > li {
  > a {
    color: ~"[[setting:themenavcolor]]";
    background-color: ~"[[setting:themecolor]]";
    &:hover, &:focus {
      color: ~"[[setting:themecolor]]";
      background-color: ~"[[setting:themenavcolor]]";
    }
  }
  &.active > a {
    color: ~"[[setting:themetextcolor]]";
    background-color: #fff;  // TODO: Pagecolour.
    &:hover, &:focus {
      color: inherit;
      background-color: inherit;
    }
  }
}

@media (max-width: @navbarCollapseWidth) {
  .nav-collapse {
    background-color: ~"[[setting:themecolor]]";
    border: 1px solid ~"[[setting:themecolor]]";
    .nav > li >, .dropdown-menu {
      a {
        &:hover, &:focus {
          color: ~"[[setting:themecolor]]";
          background-color: ~"[[setting:themenavcolor]]";
        }
      }
    }
  }
}

/* @end */

/* @group Performance Information */

.performanceinfo {
  border-color: ~"[[setting:themeiconcolor]]";
  var {
    background-color: ~"[[setting:themecolor]]";
    color: ~"[[setting:themenavcolor]]";
  }
  h2 {
    color: ~"[[setting:themetextcolor]]";
    border-bottom-color: ~"[[setting:themeiconcolor]]";
    &:before {
      color: ~"[[setting:themeiconcolor]]";
    }
  }
  span {
    color: ~"[[setting:themetextcolor]]";
  }
  #cache:before, #load:before, #memory:before, #peakmemory:before, #session:before, #included:before, #dbqueries:before, #dbtime:before {
    color: ~"[[setting:themenavcolor]]";
  }
}

/* @end */

/* @group Quiz */

#page-mod-quiz-edit .questionbankwindow {
  &.block div.header {
    background-color: ~"[[setting:themecolor]]";
    border: 1px solid ~"[[setting:themeiconcolor]]";
    div.title h2 {
      color: ~"[[setting:themenavcolor]]";
      a {
        &#showbankcmd, &#hidebankcmd {
            color: ~"[[setting:themenavcolor]]";
            &:hover {
                color: ~"[[setting:themenavcolor]]";
            }
        }
      }
      &:before {
          color: ~"[[setting:themenavcolor]]";
      }
    }
  }
}

/* @end */

/* @group Gradebook */

table#user-grades {
  th.item, th.categoryitem, th.courseitem {
    border-bottom-color: ~"[[setting:themecolor]]";
  }
}

.path-grade-report-grader {
  table#fixed_column th {
    border-right-color: ~"[[setting:themecolor]]";
  }
  .grade_icons img {
    background-color: #fff;
    padding: 3px;
    border-radius: 3px;
  }
}

/* @end */

/* @group Back To Top */

.back-to-top a {
  color: ~"[[setting:themecolor]]" !important;
  &:hover {
    color: ~"[[setting:themehovercolor]]" !important;
  }
}

/* @end */

/* @group Headings */
h1, h2, h3, h4, h5, h6,
.back-to-top,
.socials p,
#profileheading,
#socialheading,
.forumpost .subject,
.block_login label {
  font-family: ~"[[setting:headingfont]]";
}

h1, h2, h3, h4, h5, h6 {
  span {
    font-family: inherit;
  }
}
/* @end */

/* @group Editicons */
.actions {
  a {
    color: ~"[[setting:themeurlcolor]]";
    &:hover, &:focus, &:active {
      color: ~"[[setting:themehovercolor]]";
    }
  }
  .moodle-actionmenu[data-enhanced].show .menu a {
    color: ~"[[setting:themeurlcolor]]";
    &:hover, &:focus, &:active {
      color: ~"[[setting:themehovercolor]]";
    }
  }
  .moodle-actionmenu[data-enhanced].show .menu a:hover {
    color: ~"[[setting:themenavcolor]]";
    background-color: ~"[[setting:themecolor]]";
    .fa:before {
      color: ~"[[setting:themenavcolor]]";
    }
  }
}

/* @end */

/* @group Chat */

#chat-input-area {
  table.generaltable {
    td.cell {
      background-color: ~"[[setting:themecolor]]" !important;
    }
  }
}

/* @end */

/* @end */